/*
 * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *         http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

// tslint:disable-next-line:no-var-requires
var JsDiff = require('diff/dist/diff.min.js');

const DiffDirective: ng.IDirective = ({
  restrict: 'AE',
  scope: {
    oldValue: '=',
    newValue: '='
  },
  link: (scope: any, elem) => {
    scope.$watch('oldValue', function() {
      var oldValue = scope.oldValue;
      var newValue = scope.newValue;

      if (oldValue && newValue) {
        elem.html('');
        var diff = JsDiff.diffJson(oldValue, newValue);
        diff.forEach(function(part) {
          // green for additions, red for deletions
          // grey for common parts
          var color = part.added ? 'green' :
            part.removed ? 'red' : 'grey';
          var span = document.createElement('span');
          span.style.color = color;
          span.appendChild(document.createTextNode(part.value));
          elem.append(span);
        });
      }
    });
  }
});

export default DiffDirective;
